<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <meta name="description" content="">
    <meta name="author" content="">
    <link rel="icon" href="/static/favicon.ico">
    <title>Signin Template for Bootstrap</title>
    <link th:href="@{/static/bootstrap/css/bootstrap.min.css}" rel="stylesheet">
    <script th:src="@{/static/js/jquery.min.js}"></script>
    <script th:src="@{/static/bootstrap/js/bootstrap.min.js}"></script>
    <link th:href="@{/static/css/signin.css}" rel="stylesheet">
</head>
<body>

<div class="container">

    <div class="form-signin">
        <ul id="myTab" class="nav nav-tabs">
            <li class="active"><a href="#account-login" data-toggle="tab">账号登录</a></li>
            <li><a href="#tel-login" data-toggle="tab">手机登录</a></li>
        </ul>
        <div id="loginTabContent" class="tab-content" style="padding-top: 10px">
            <div class="tab-pane fade in active" id="account-login">
                <form th:action="@{/signin/form/account}" method="post">
                    <label for="username" class="sr-only">用户名</label>
                    <input class="form-control" type="text" name="username" id="username" value="user" placeholder="账号" required>
                    <label for="password" class="sr-only">密码</label>
                    <input class="form-control" type="password" name="password" id="password" value="123456" placeholder="密码" required>
                    <div class="input-group">
                        <label for="yzm" class="sr-only">验证码</label>
                        <input class="form-control" style="width: 50%" type="text" name="yzm" id="yzm" value="" placeholder="验证码" />
                        <img th:src="@{/code/image}" style="height: 45px;width: 50%;"/>
                    </div>
                    <button class="btn btn-lg btn-primary btn-block" type="submit">登录</button>
                </form>
            </div>
            <div class="tab-pane fade" id="tel-login">
                <form th:action="@{/signin/form/tel}" method="post">
                    <label for="telNo" class="sr-only">手机号码</label>
                    <input class="form-control" type="text" name="telNo" id="telNo" value="13712345678" placeholder="手机号码" required>
                    <label for="smsCode" class="sr-only">验证码</label>
                    <input class="form-control" type="password" name="smsCode" id="smsCode" value="1234" placeholder="短信验证码" required>
                    <div class="input-group">
                        <label for="yzm" class="sr-only">验证码</label>
                        <input class="form-control" style="width: 50%" type="text" name="yzm" id="yzm" value="" placeholder="验证码" />
                        <img th:src="@{/code/image}" style="height: 45px;width: 50%;"/>
                    </div>
                    <img style="display: none" th:src="@{/code/mobile}" />
                    <button class="btn btn-lg btn-primary btn-block" type="submit">登录</button>
                </form>
            </div>
        </div>
    </div>

</div>

</body>
</html>